import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import '../base/base_app.dart';

/// 创建人： Created by zhaolong
/// 创建时间：Created by  on 2021/9/25.
///
/// gongzhonghao biglead
/// https://study.163.com/instructor/1021410098.htm
/// https://blog.csdn.net/zl18603543572
/// https://www.toutiao.com/c/user/token/MS4wLjABAAAAYMrKikomuQJ4d-cPaeBqtAK2cQY697Pv9xIyyDhtwIM/
///
///
///

//应用入口
void main() {
  ///启动根目录
  runApp(BaseApp(
    homeWidget: Example410(),
  ));
}

///代码清单 4-17
///lib/code/code4/example_410_imageshow_page.dart
///图片浏览器
class Example410 extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _ExampleState();
  }
}

class _ExampleState extends State<Example410> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("图片浏览器"),
      ),
      backgroundColor: Colors.white,
      body: Container(
        width: 200,
        child: Stack(
          children: [
            ClipRect(
              child: Align(
                alignment: Alignment.centerLeft,
                widthFactor: 0.1,
                child: Row(
                  children: [
                    Image.asset(
                      "assets/images/star_icon.png",
                      width: 22,
                    ),
                    Image.asset(
                      "assets/images/star_icon.png",
                      width: 22,
                    ),
                    Image.asset(
                      "assets/images/star_icon.png",
                      width: 22,
                    ),
                    Image.asset(
                      "assets/images/star_icon.png",
                      width: 22,
                    ),
                  ],
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  buildSegment() {
    return ClipOval(
      child: Container(
        width: 100,
        height: 100,
        color: Colors.blue,
      ),
    );
  }

  //ClipRect 将 child 剪裁为给定的矩形大小
  buildClipRect() {
    return ClipRect(
      /// 自定义裁剪路径
      clipper: ClipperPath(),
      child: Container(
        width: 100,
        height: 100,
        color: Colors.blue,
      ),
    );
  }

  buildTriangle() {
    return ClipPath(
      clipper: TriangleClipper(),
      child: Image.network(
        'https://p3fx.kgimg.com/v2/fxuserlogo/7e83eb705e9a7dbddfbc4a265e14e018.jpg_200x200.jpg',
        fit: BoxFit.cover,
        width: 100,
        height: 100,
      ),
    );
  }
}

class ClipperPath extends CustomClipper<Rect> {
  @override
  Rect getClip(Size size) {
    return new Rect.fromLTRB(100, 10, size.width, size.height);
  }

  @override
  bool shouldReclip(CustomClipper<Rect> oldClipper) {
    return true;
  }
}

class TriangleClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path()
      ..moveTo(0.0, size.height)
      ..lineTo(size.width, size.height)
      ..lineTo(size.width / 2, size.height / 2)
      ..close();
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}
